<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>TOL设计</title>
  <link href="https://registry.npmmirror.com/bootstrap/3.4.1/files/dist/css/bootstrap.min.css" rel="stylesheet">
</head>

<body>
  <div class="container">

    <h3>重置密码</h3>
    <hr>

    <form class="form-horizontal form login-form" name="resetform" id="reset-form">
      <!-- <legend>重置密码</legend> -->
      <div class="alert" style="display:none" id="error">
        <button type="button" class="close" data-dismiss="alert">&times;</button>
      </div>

      <div class="form-group">
        <label class="col-sm-2 control-label" for="inputEmail" id="newPass">新密码</label>
        <div class="col-sm-4">
          <input type="password" id="inputEmail" class="form-control" name="password" required>
        </div>
      </div>

      <div class="form-group">
        <label class="col-sm-2 control-label" for="inputPassword" id="confirmPass">重新输入</label>
        <div class="col-sm-4">
          <input type="password" id="inputPassword" class="form-control" name="password1" required>
        </div>
      </div>

      <div class="form-group">
        <div class="col-sm-offset-2 col-sm-4">
          <button type="button" class="btn btn-default" id="reset">重置</button>
        </div>
      </div>
    </form>




  </div><!--end container-->
  <script src="https://registry.npmmirror.com/jquery/1.12.4/files/dist/jquery.min.js"></script>

  <script type="text/javascript">
    // naive mimic of polyglot.js
    function Polyglot(options) {
      this.phrases = options.phrases;
    }
    Polyglot.prototype.t = function (key) {
      return this.phrases[key];
    }

    // i18n
    var zhPhrases = {
      resetPass: "重置密码",
      newPass: "新密码",
      confirmPass: "重新输入",
      reset: "重置",
      passwordMismatch: "两次输入不一致",
      resetSucc:
        "重置密码成功",
      tokenInvalid: "Token 已过期或无效",
      serverError: "服务器发生错误",
    };
    var enPhrases = {
      resetPass: "Reset Password",
      newPass: "New password",
      confirmPass: "Confirm password",
      reset: "Reset",
      passwordMismatch: "Your password and confirmation password do not match.",
      resetSucc:
        "Your password has been reset.",
      tokenInvalid: "Token is expired or invalid.",
      serverError: "A server error occurred.",
    };
    var i18nPhrases =
      window.navigator.language.slice(0, 2) === "zh" ? zhPhrases : enPhrases;
    var polyglot = new Polyglot({ phrases: i18nPhrases });

    $("h3").text(polyglot.t("resetPass"));
    $("#newPass").text(polyglot.t("newPass"));
    $("#confirmPass").text(polyglot.t("confirmPass"));
    $("#reset").text(polyglot.t("reset"));

    //获得token
    var token = location.search.match(/token=(\w*)/);
    if (token && token[1]) {
      token = token[1];
    }
    $(function () {
      $("#reset").click(function () {
        var p = $("[name=password]");
        var p1 = $("[name=password1]");
        if (p.val() != p1.val()) {
          $("#error").show();
          $("#error").text(polyglot.t("passwordMismatch"));
        }
        if (p.val() && p1.val() && p.val() == p1.val()) {
          $.ajax({
            dataType: 'jsonp',
            // CHANGE THE URL BELOW.
            url: "https://api.example.com/1.1/resetPassword/" + token,
            // Replace api.example.com with:
            // - (LeanCloud China) your own custom api domain
            // - (LeanCloud Intl.) FIRST-8-CHARACTERS-OF-YOUR-APP-ID-IN-LOWERCASE.api.lncldglobal.com
            data: { "password": p.val() },
            success: function (result) {
              $("#error").show();  // error is used for both success and failure message.
              if (result.error) {
                if (result.error.startsWith("Token")) {
                  $("#error").text(polyglot.t("tokenInvalid"));
                } else {
                  $("#error").text(result.error);
                }
              } else {
                $("#error").html(polyglot.t("resetSucc"));
              }
            },
            error: function (result, text) {
              $("#error").text(polyglot.t("serverError"));
            }
          });
        }

      });
    });




  </script>
</body>

</html>